import React, { Component } from 'react';
import {StyleSheet, Text, View, TouchableOpacity, Image, FlatList, StatusBar, TextInput, ScrollView, Picker} from 'react-native';
import { base } from "../../../../assets/style";
import LinearGradient from "react-native-linear-gradient";
import ReactNativePickerSelect from 'react-native-picker-select'
import { i18n } from "../../../../utils/locales/i18n";

type Props = {};
export default class ModifyAsseets extends Component<Props> {
    static navigationOptions = ({ navigation }) => {
        return {
            title: i18n.t('i52'),
            headerStyle: {
            },
            headerTintColor: '#0f0f0f',
            headerBackTitle: null
        }
    };
    constructor() {
        super();
        this.state = {
            originPassword: '',
            newPassword: '',
            newPassword2: '',
            verifyCode: ''
        }
    }
    render() {
        return (
            <View style={[base.flex_1, base.bg_gray, base.content_container]}>
                <View style={{paddingHorizontal: 15, paddingBottom: 20, backgroundColor: '#fff', alignItems: 'center', marginTop: 10, borderRadius: 5 }}>
                    <View style={[base.flex_col_center, { height: 80 }]}>
                        <Text style={[base.color_gray, { fontSize: 20, color: '#0f0f0f' }]}>{ i18n.t('m_a_pass') }</Text>
                    </View>
                    <View style={[base.flex_row_between, { marginVertical: 5, height: 45, width: '100%', borderRadius: 5, borderWidth: 1, borderColor: '#d2d2d2', paddingHorizontal: 15 }]}>
                        <TextInput
                            style={[base.color_gray, {width: '100%'}]}
                            value={this.state.originPassword}
                            onChangeText={(text) => this.setState({originPassword: text})}
                            placeholder={i18n.t('info23')}
                        />
                    </View>
                    <View style={[base.flex_row_between, { marginVertical: 5, height: 45, width: '100%', borderRadius: 5, borderWidth: 1, borderColor: '#d2d2d2', paddingHorizontal: 15 }]}>
                        <TextInput
                            style={[base.color_gray, {width: '100%'}]}
                            value={this.state.newPassword}
                            onChangeText={(text) => this.setState({newPassword: text})}
                            placeholder={i18n.t('info24')}
                        />
                    </View>
                    <View style={[base.flex_row_between, { marginVertical: 5, height: 45, width: '100%', borderRadius: 5, borderWidth: 1, borderColor: '#d2d2d2', paddingHorizontal: 15 }]}>
                        <TextInput
                            style={[base.color_gray, {width: '100%'}]}
                            value={this.state.newPassword2}
                            onChangeText={(text) => this.setState({newPassword2: text})}
                            placeholder={i18n.t('info25')}
                        />
                    </View>
                    <View style={{ height: 45, width: '100%', borderColor: '#d2d2d2', borderWidth: 1, borderRadius: 5, marginVertical: 10, flexDirection: 'row' }}>
                        <TextInput
                            style={{color: '#808080', width: '100%', height: '100%', flex: 1, paddingLeft: 15, borderRightColor: '#d2d2d2', borderRightWidth: 1}}
                            onChangeText={(text) => this.setState({messageCode: text})}
                            placeholder={ i18n.t('m_message') }
                            value={this.state.messageCode}
                        />
                        <TouchableOpacity style={{width: 100, height: '100%'}}>
                            <View style={[base.flex_1, base.flex_row_center]}><Text style={[base.color_orange, {fontSize: 16}]}>{ i18n.t('cag') }</Text></View>
                        </TouchableOpacity>
                    </View>
                </View>
                <View style={[base.flex_1, base.flex_col_center, { paddingBottom: 30 }]}>
                    <TouchableOpacity style={{width: '100%'}} onPress={this.toWithdrawSuccess}>
                        <LinearGradient
                            start={{x: 0, y: 0}}
                            end={{x: 1, y: 1}}
                            colors={['#feac1c', '#ff7506']}
                            style={{ width: '100%', height: 46, borderRadius: 23, justifyContent: 'center', alignItems: 'center' }}
                        >
                            <Text style={{color: '#fff', fontSize: 16}}>{i18n.t('save')}</Text>
                        </LinearGradient>
                    </TouchableOpacity>
                </View>
            </View>
        )
    }
}

const styles = StyleSheet.create({
});
